<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>ButtonHover</title>
    <link rel="stylesheet" href="css/buttonhover.css">
    <!--from http://zaole.net/-->
</head>
<body>
    <div class="main">
        <h4>Just Some More
            Button Hover Effects</h4>
        <div class="container">
            <a href="javascript:;" class="btn-1">HTML</a>
            <a href="javascript:;" class="btn-2">css</a>
            <a href="javascript:;" class="btn-3">javascript</a>
            <a href="javascript:;" class="btn-4">jquery</a>
            <a href="javascript:;" class="btn-5"><span>ext</span></a>
            <a href="javascript:;" class="btn-6"><span>vue</span></a>
        </div>
        <div class="container">
            <a href="javascript:;" class="btn-7">angular</a>
            <a href="javascript:;" class="btn-8"><span>bootstrap</span></a>
            <a href="javascript:;" class="btn-9">require</a>
            <a href="javascript:;" class="btn-10"><span>react</span></a>
            <a href="javascript:;" class="btn-11"><span>webpack</span></a>
            <a href="javascript:;" class="btn-12">fis3</a>
            <!--use js-->
            <a href="javascript:;" class="btn-13-js">gulp<span></span></a>
            <script src="js/slidings.js"></script>
            <script src="js/btn-13-js.js"></script>
        </div>
    </div>
</body>
<!--<script type="text/javascript">-->
    <!--function timedMsg(){-->
        <!--var t=setTimeout(function(){-->
            <!--document.getElementsByClassName("main")[0].style.display="none";-->
        <!--},3000)-->
    <!--}-->
    <!--timedMsg();-->
<!--</script>-->
</html>